<template>
  <div class="score" v-if="reviewType">
    <span class="fl score-txt"
      ><span class="el-icon-star-off"></span> 评 分：</span
    >
    <span v-show="!score" class="fl score-nothing">暂无评分</span>
    <span class="fl star">
      <el-rate
        v-show="score"
        v-model="score"
        disabled
        show-score
        text-color="#ff9900"
        score-template="{value}"
      >
      </el-rate>
    </span>
    <el-button
      type="custom"
      size="small"
      @click="addEvaluate()"
      icon="el-icon-edit"
      class="add-btn"
      v-if="showBtn"
    >
      我要评价
    </el-button>
  </div>
</template>
<script>
import { sysEvaluateGetAvgScore } from '@/api/openApi.js'
import Bus from '@/utils/bus.js'
export default {
  data() {
    return {
      score: 0,
      reviewType: false,
    }
  },
  props: ['resId', 'resType', 'showBtn'],
  watch: {
    resId() {
      this.getInfo()
    },
  },
  mounted() {
    this.getReviewType()
    Bus.$on('showScore', (v) => {
      this.getInfo()
    })
  },
  beforeDestroy() {
    Bus.$off('showScore')
  },
  methods: {
    //评论开关
    async getReviewType() {
      let res = await this.$store.dispatch('getDictionaryVal', 'REVIEW_SWITCH')
      this.reviewType = res[0] == 1
      if (this.reviewType) {
        this.getInfo()
      }
    },
    getInfo() {
      let data = {
        resId: this.resId,
        resType: this.resType,
      }
      sysEvaluateGetAvgScore(data).then((res) => {
        let result = res.data.data[0]
        this.score =
          result && result.score
            ? parseFloat(parseFloat(result.score).toFixed(2))
            : 0
      })
    },
    addEvaluate() {
      // 预览模式不触发事件
      if (this.$route.query.queryMode == 2) {
        this.previewTip()
        return
      }
      //判断是否登录
      if (!this.$store.getters.userId) {
        this.loginTip()
        return
      }
      Bus.$emit('showDialogReviewAdd')
    },
  },
}
</script>
<style scoped lang="scss">
.score {
  height: 38px;
  line-height: 38px;
  .score-txt {
    position: relative;
    font-size: 14px;
    color: #000;
  }
  .el-icon-star-off {
    color: #ac100f;
    font-size: 15px;
    font-weight: bold;
  }
  .score-nothing {
    color: #666;
  }
  .star {
    margin-right: 20px;
    margin-top: 10px;
  }
}
</style>